<template>
  <div style="margin: 0px; padding: 0px; height: 100%">
    
    <vs-card-group>
      <vs-card>
        <template #title>
          <h3>Pot with a plant</h3>
        </template>
        <template #img>
         <img src="http://47.103.195.54:9000/image/83216379_p0.jpg" >
        </template>
        <template #text>
          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.</p>
        </template>
        <template #interactions>
          <vs-button danger icon>
            <i class="bx bx-heart"></i>
          </vs-button>
          <vs-button class="btn-chat" shadow primary>
            <i class="bx bx-chat"></i>
            <span class="span"> 54 </span>
          </vs-button>
        </template>
      </vs-card>
      <vs-card type="3">
        <template #title>
          <h3>Pot with a plant</h3>
        </template>
        <template #img>
          <img
            src="http://47.103.195.54:9000/image/76153784_p0.jpg"
            alt=""
          />
        </template>
        <template #text>
          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.</p>
        </template>
        <template #interactions>
          <vs-button danger icon>
            <i class="bx bx-heart"></i>
          </vs-button>
          <vs-button class="btn-chat" shadow primary>
            <i class="bx bx-chat"></i>
            <span class="span"> 54 </span>
          </vs-button>
        </template>
      </vs-card>
      <vs-card type="4">
        <template #title>
          <h3>Pot with a plant</h3>
        </template>
        <template #img>
          <img
            src="https://i.loli.net/2021/03/08/fFqpucjBUdVJyeK.jpg"
            alt=""
          />
        </template>
        <template #text>
          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.</p>
        </template>
        <template #interactions>
          <vs-button danger icon>
            <i class="bx bx-heart"></i>
          </vs-button>
          <vs-button class="btn-chat" shadow primary>
            <i class="bx bx-chat"></i>
            <span class="span"> 54 </span>
          </vs-button>
        </template>
      </vs-card>
      <vs-card type="5">
        <template #title>
          <h3>Pot with a plant</h3>
        </template>
        <template #img>
          <img
            src="https://i.loli.net/2021/03/08/fFqpucjBUdVJyeK.jpg"
            alt=""
          />
        </template>
        <template #text>
          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.</p>
        </template>
        <template #interactions>
          <vs-button danger icon>
            <i class="bx bx-heart"></i>
          </vs-button>
          <vs-button class="btn-chat" shadow primary>
            <i class="bx bx-chat"></i>
            <span class="span"> 54 </span>
          </vs-button>
        </template>
      </vs-card>
    </vs-card-group>
  </div>
</template>

<script>
export default {};
</script>

<style>
::-webkit-scrollbar {
      width: 5px;
    height: 5px;
    display: block;
    background:#ffffff ;
}
::-webkit-scrollbar-thumb {
    background:  #541312;
    border-radius: 5px;
}
</style>